<template>
  <el-card class="card-body">
    <el-row>
      <el-table
          :data="tableData"
          class="table-body"
          :header-cell-style="{ background: '#F4F6F9', color: '#1D2129' }"
      >
        <el-table-column type="index" width="50"></el-table-column>
        <el-table-column prop="name" show-overflow-tooltip label="标题"></el-table-column>
        <el-table-column
            prop="moduleName"
            label="所属栏目"
            width="220"
        ></el-table-column>
        <el-table-column prop="createDate" width="160" label="时间"></el-table-column>
        <el-table-column prop="userName" width="120" label="作者"></el-table-column>
        <el-table-column label="操作" width="200" fixed="right">
          <template slot-scope="scope">
            <el-button type="text" @click="handleEdit(scope.row)"
            >编辑
            </el-button
            >
            <el-button type="text" @click="handleDelete(scope.row.id)"
            >删除
            </el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <Pagination
          :count="Number(count)"
          :current="1"
          @handleSizeChange="handleSizeChange"
          @handleCurrentChange="handleCurrentChange"
      />
      <Detail ref="detail" @getParentTableData="getTableData"/>
    </el-row>
  </el-card>
</template>

<script>
// import SearchForm from './components/SearchForm';
// import DataTables from './components/DataTables';
import {
  // deleteArticleApi,
  operationArticleApi,
} from "@/api/modules/article.api";
import Pagination from "@/components/Pagination.vue";
import {deleteDraft, getDraftListApi} from "@/api/modules/approve.api";
import {mapMutations} from "vuex";
import Detail from "@/templates/Writings/Gallery/Detail";

export default {
  components: {
    Pagination,
    Detail,
  },
  data() {
    return {
      tableData: [],
      count: 0,
      page: {
        pageNum: 1,
        pageSize: 10,
        status: 1,
      },
    };
  },
  mounted() {
    this.getTableData(this.page);
  },
  methods: {
    ...mapMutations("base", ["setBreadcrumb"]),
    async getTableData({pageNum = 1, pageSize = 10}) {
      const res = await getDraftListApi({pageNum, pageSize});
      this.tableData = res.records;
      this.count = res.total;
    },
    async handlePass(id) {
      await operationArticleApi({id: id, status: 2});
      await this.getTableData(this.page);
    },
    async handleDelete(id) {
      await deleteDraft({id});
      this.$message({
        message: "成功",
        type: "success",
      });
      await this.getTableData(this.page);
    },
    handleSizeChange(pageSize) {
      this.page.pageNum = pageSize;
      this.$emit("getTableData", this.page);
      this.getTableData(this.page);
    },
    handleCurrentChange(pageNum) {
      this.page.pageNum = pageNum;
      this.getTableData(this.page);
    },
    handleEdit(row) {
      // 0:新闻，1：图集，2：通知公告，3：光荣榜
      if (row.bizType === 0) {
        this.$router.push({
          name: "/writings/list/detail",
          query: {id: row.id, type: "1"},
        });
        this.setBreadcrumb([
          {
            name: "文章管理",
            path: "/writings",
          },
          {
            name: "草稿箱",
            path: "/writings/list",
          },
          {
            name: "编辑",
            path: "/writings/list/detail",
          },
        ]);
      } else if (row.bizType === 2) {
        this.$router.push({
          name: "/writings/notifications/detail",
          query: {id: row.id, type: "1"},
        });
        this.setBreadcrumb([
          {
            name: "文章管理",
            path: "/writings",
          },
          {
            name: "通知公告",
            path: "/writings/notifications",
          },
          {
            name: "编辑",
            path: "/writings/notifications/detail",
          },
        ]);
      } else if (row.bizType === 3) {
        this.$router.push({
          name: "/writings/honor/detail",
          query: {id: row.id, type: "1"},
        });
        this.setBreadcrumb([
          {
            name: "文章管理",
            path: "/writings",
          },
          {
            name: "光荣榜",
            path: "/writings/honor",
          },
          {
            name: "编辑",
            path: "/writings/honor/detail",
          },
        ]);
      } else if (row.bizType === 1) {
        this.$refs.detail.init(row.id);
      }
    },
  },
};
</script>
